<template>
    <div>
        <Title>零售商品选购</Title>
        <NuxtLayout name="common">
            <div class="box mt-[30px]">
                <t-card title="测试数量都算 10 ， 默认尺寸都算 165cm ">
                    <t-form>
                        <t-form-item label="商品选择">
                            <t-checkbox-group v-model="orderInfo.goods_list">
                                <t-checkbox key="all" :check-all="true" label="全选" />
                                <t-checkbox key="Txu" value="T恤">T恤</t-checkbox>
                                <t-checkbox key="Txu" value="运动短裤">运动短裤</t-checkbox>
                                <t-checkbox key="Txu" value="运动短裙">运动短裙</t-checkbox>
                                <t-checkbox key="Txu" value="内胆">内胆</t-checkbox>
                            </t-checkbox-group>
                        </t-form-item>
                        <t-form-item label="姓名">
                            <t-input v-model="orderInfo.content.username" placeholder="请输入姓名"></t-input>
                        </t-form-item>
                        <t-form-item label="电话">
                            <t-input v-model="orderInfo.content.phone" placeholder="请输入电话号码"></t-input>
                        </t-form-item>
                        <t-form-item label="收货地址">
                            <t-input v-model="orderInfo.content.address" placeholder="请输入收货地址"></t-input>
                        </t-form-item>
                        <t-form-item>
                            <t-button @click="clickSubmitOrder">提交订单</t-button>
                        </t-form-item>
                    </t-form>
                </t-card>
            </div>
        </NuxtLayout>
    </div>
</template>

<script setup lang="ts">
import { MessagePlugin } from 'tdesign-vue-next';
import { reactive, ref } from 'vue';
import { useRouter } from 'vue-router';

// 使用路由
const router = useRouter();

// 订单标
const orderTable = ref([]);

// 零售收货人信息
const orderInfo = reactive({
    content: {
        username: '张三',
        phone: '13800138000',
        address: '重庆市北碚区蔡家岗街道倍都佳园D区'
    },
    goods_list: [],
    sale: {
        order_number: '',
        order_time: '',
        order_from: ''
    },
    out_warehouse: {
        warehouse_name: '',
        out_number: '',
        out_time: '',
        express_number: '',
    }
})

// 点击提交订单按钮
const clickSubmitOrder = () => {
    // console.log(orderInfo.goods_list);return;
    let date = new Date();
    let numberPrefix = `${date.getFullYear()}${date.getMonth() + 1}${date.getDate()}`

    // 判断商品列表
    if (orderInfo.goods_list.length < 1) {
        MessagePlugin.error({
            content: '必须选择商品'
        })
        return;
    }
    // 判断用户信息
    if (orderInfo.content.username === '') {
        MessagePlugin.error({
            content: '收货人不能为空'
        })
        return;
    }
    if (orderInfo.content.phone === '') {
        MessagePlugin.error({
            content: '联系电话不能为空'
        })
        return;
    }
    if (orderInfo.content.address === '') {
        MessagePlugin.error({
            content: '收货地址不能为空'
        })
        return;
    }

    // 获取本地订单信息
    let localOrderInfoList = localStorage.getItem('orderTable');
    if (localOrderInfoList === null) { // 无历史订单，直接写入        
        // 需要转换订单信息
        for (let i = 0; i < orderInfo.goods_list.length; i++) {
            let tmp = {
                'goods_title': orderInfo.goods_list[i],
                'goods_number': 10,
                'goods_size': '165'
            }
            orderInfo.goods_list[i] = tmp
        }
        // 组装ERP销售订单信息
        orderInfo.sale.order_number = `XS-${numberPrefix}${Math.floor(Math.random() * 10000)}`
        orderInfo.sale.order_time = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`
        orderInfo.sale.order_from = '商城网单'

        // 组装ERP出库单
        orderInfo.out_warehouse.out_number = `CK-${numberPrefix}${Math.floor(Math.random() * 10000)}`

        orderTable.value.push(orderInfo);
        localStorage.setItem('orderTable', JSON.stringify(orderTable.value));
        orderInfo.content = {
            username: '张三',
            phone: '13800138000',
            address: '重庆市北碚区蔡家岗街道倍都佳园D区'
        },
            orderInfo.goods_list = [];
    } else { // 有历史订单        
        // // 格式化历史订单
        let oldOrderInfo = JSON.parse(localOrderInfoList);
        // 转换订单信息
        for (let i = 0; i < orderInfo.goods_list.length; i++) {
            let tmp = {
                'goods_title': orderInfo.goods_list[i],
                'goods_number': 10,
                'goods_size': '165'
            }
            orderInfo.goods_list[i] = tmp
        }
        // 组装ERP销售订单信息
        orderInfo.sale.order_number = `XS-${numberPrefix}${Math.floor(Math.random() * 10000)}`
        orderInfo.sale.order_time = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`
        orderInfo.sale.order_from = '商城网单'

        // 组装ERP出库单
        orderInfo.out_warehouse.out_number = `CK-${numberPrefix}${Math.floor(Math.random() * 10000)}`

        oldOrderInfo.push(orderInfo);
        localStorage.setItem('orderTable', JSON.stringify(oldOrderInfo));
        orderInfo.content = {
            username: '张三',
            phone: '13800138000',
            address: '重庆市北碚区蔡家岗街道倍都佳园D区'
        },
            orderInfo.goods_list = [];

    }
    MessagePlugin.success({
        content: '下单成功，我们将尽快为您安排发货'
    })
    // 跳转到用户中心
    setTimeout(() => {
        router.replace('/')
    }, 2000)
}
</script>

<style scoped></style>